import React, {Component} from 'react';
import {NavLink} from 'react-router-dom';
import {Card, Form, Input, Button, message, Icon, Select} from "antd";

class IndexEducation extends Component {
    handleSubmit = (e) => {
        e.preventDefault();
        this.props.form.validateFields((err, values) => {
            if (!err) {
                // message.success('Received values of form: ', values.DISCIPLINE);
                message.info(`Click on item ${values.DISCIPLINE}`);
                console.log(values);
            }
        });
    };

    render() {
        const Option = Select.Option;
        const {getFieldDecorator} = this.props.form;

        return (
            <div className="welding-association education-set row">
                <div className="text-center">
                    <h2>教育培训</h2>
                    <div className="welding-set-gutter-line">
                        <hr/>
                        <span/>
                        <hr/>
                    </div>
                    <h3>EDUCATION AND TRAINING</h3></div>
                <div className="clearfix association-education mrt30">
                    <div className="col-lg-1"/>
                    <div className="col-lg-5 col-md-6">
                        <div className="row">
                            <ul>
                                <li>
                                    <span><b>25</b><small>12月<br/>2018</small></span>
                                    <span/>
                                    <span><NavLink to={{
                                        pathname: '/educational/educational_training',
                                        state: {id: "上海市发展和改革委员会关于价格的通知"}
                                    }}>API570管道检验师ICP培训</NavLink></span>
                                </li>
                                <li>
                                    <span><b>18</b><small>10月<br/>2018</small></span>
                                    <span/>
                                    <span><NavLink to={{
                                        pathname: '/educational/educational_training',
                                        state: {id: "上海市发展和改革委员会关于价格的通知"}
                                    }}>上海市焊接协会与德国TuV莱茵合作举办ISO9712无......</NavLink></span>
                                </li>
                                <li>
                                    <span><b>05</b><small>08月<br/>2018</small></span>
                                    <span/>
                                    <span><NavLink to={{
                                        pathname: '/educational/educational_training',
                                        state: {id: "上海市发展和改革委员会关于价格的通知"}
                                    }}>CWI培训考试报名表</NavLink></span>
                                </li>
                                <li>
                                    <span><b>01</b><small>06月<br/>2018</small></span>
                                    <span/>
                                    <span><NavLink to={{
                                        pathname: '/educational/educational_training',
                                        state: {id: "上海市发展和改革委员会关于价格的通知"}
                                    }}>培训广泛焊接人才的上海市焊接协会</NavLink></span>
                                </li>
                                <li>
                                    <span><b>12</b><small>03月<br/>2018</small></span>
                                    <span/>
                                    <span><NavLink to={{
                                        pathname: '/educational/educational_training',
                                        state: {id: "上海市发展和改革委员会关于价格的通知"}
                                    }}>无损伤I级/II级人员资格认证（SNT-TC-IA）培训</NavLink></span>
                                </li>
                            </ul>
                        </div>
                    </div>
                    <div className="col-lg-1 col-md-1"/>
                    <div className="col-lg-3 col-md-5 col-lg-offset-1">
                        <Card title="成绩查询" size="small">
                            <Form onSubmit={this.handleSubmit}>
                                <Form.Item>
                                    {
                                        getFieldDecorator('DISCIPLINE')(<Select placeholder="--请选择查询科目--">
                                            <Option value="jack">Jack</Option>
                                            <Option value="lucy">Lucy</Option>
                                            <Option value="disabled" disabled>Disabled</Option>
                                            <Option value="Yiminghe">yiminghe</Option>
                                        </Select>)
                                    }
                                </Form.Item><Form.Item>
                                {
                                    getFieldDecorator('IDCARD', {
                                        initialValue: '',
                                        rules: [
                                            {
                                                required: true,
                                                message: '身份证号不能为空'
                                            },
                                            // {
                                            //     min: 5, max: 10,
                                            //     message: '长度不在范围内'
                                            // },
                                            // {
                                            //     pattern: new RegExp('^\\w+$', 'g'),
                                            //     message: '用户名必须为字母或者数字'
                                            // }
                                        ]
                                    })(<Input prefix={<Icon type="idcard"/>} placeholder="请输入您的身份证号码"/>)
                                }
                            </Form.Item>
                                <Form.Item>
                                    {
                                        getFieldDecorator('PHONE', {
                                            initialValue: '',
                                            rules: [{
                                                required: true,
                                                message: '手机号码不能为空'
                                            },]
                                        })(<Input prefix={<Icon type="phone"/>} placeholder="请输入考试报名手机号码"/>)
                                    }
                                </Form.Item>
                                <Form.Item>
                                    <Button style={{width: "100%"}} type="primary" htmlType="submit"
                                            className="login-form-button">
                                        确认查询
                                    </Button>
                                </Form.Item>

                                <div className="text-danger">
                                    <small>注意：83238957万会发生接电话罚款伤筋动骨哈克斯gas肯定会发司空见惯83238957万会发生接电话罚款伤筋动骨哈克斯gas肯定会发司空见惯
                                    </small>
                                </div>
                            </Form>
                        </Card>
                    </div>
                </div>
            </div>
        );
    }
}

export default Form.create()(IndexEducation);